iT邦幫忙

2021 iThome 鐵人賽

DAY 13
0
自我挑戰組

從 React 開始,讓你的ui material 起來系列 第 13

[Day 13] 常用數據顯示 Table 表格-1(制式版)

  • 分享至 

  • xImage
  •  

傳統網頁曾經有用過Table 排版並顯示

當各式排版方式橫行的時代

Table 已經歸類於資料呈現的方式了

想當然爾,material-UI 也有自我樣式的Table

是個功能強大的制式表格
如下圖他可以簡單正序倒序,以及下簡單的條件
https://ithelp.ithome.com.tw/upload/images/20210927/20098345YflLKaBWmN.png

參數也可以很簡單設定
rows 寫入其 Title
columns 寫入Table內容
pageSize 可以設定每頁資料筆數

<DataGrid
  rows={rows}
  columns={columns}
  pageSize={5}
/>

D13


上一篇
[Day 12] 開關 Switch
下一篇
[Day 14] 常用數據顯示 Table 表格-2(可調式)
系列文
從 React 開始,讓你的ui material 起來15
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言